<template>
	<view v-if="visible" class="at-message-tip" @click="goToMessage">
		用户提到了你
	</view>
</template>

<script>
	export default {
		data() {
			return {
				visible: false,
				atMessageId: null, // 被@消息的ID
			};
		},
		methods: {
			showTip(messageId) {
				this.atMessageId = messageId;
				this.visible = true;

				// //自动隐藏提示（可选）
				// setTimeout(() => {
				// 	this.hideTip();
				// }, 10 * 1000); // 例如，10秒后自动隐藏
			},
			hideTip() {
				this.visible = false;
			},
			goToMessage() {
				if (this.atMessageId) {
					this.$emit('goto', this.atMessageId);
				}
				this.hideTip();
			}
		}
	};
</script>

<style scoped>
	.at-message-tip {
		position: fixed;
		bottom: 100px;
		right: 60px;
		padding: 5px 10px;
		background-color: #fff;
		color: #0055ff;
		border-radius: 5px;
		font-size: 14px;
		z-index: 9999;
		box-shadow: 2px 2px 5.5px 0 #00000042;
	}
</style>